<template>
	<view>
		<view class="cookType">
			<view class="cook_item " v-for="(item,index) in list" :key="index" @click="goCook(item.id,item.name)">
				<image style="width: 80rpx;height:80rpx;border-radius: 8rpx;" :src="item.picAbsolute" ></image>
				<view  style="font-size: 24rpx;"  :class="foodCategoryId==item.id?'redactive':''">{{ item.name }}</view>
			</view>
		</view>
	</view>
</template>

<script>
  export default {
    name:"cook-type",
    props:{
      list:{
        type:Array,
        default:[]
      },
      foodCategoryId:''
    },
   data() {
   	return {
   
   	};
   },
   methods:{
     goCook(id,title){
       this.$emit('goCook',{id,title})
     },
     tablist(url){
       uni.navigateTo({
         url:url
       })
     }
   }
  }
</script>

<style scoped lang="scss">
  .redactive{color: #009977;}
</style>
